{% extends "base.html" %}

{% block content %}
<link href="{{url_for('static',filename='css/index.css')}}" rel="stylesheet" />
<link href="{{url_for('static',filename='css/blog.css')}}" rel="stylesheet" />
<div class="blog-body">
    
    <div class="blog-container">
        <div class="blog-main">
            <div class="home-tips shadow">
                <i style="float:left;line-height:17px;" class="fa fa-volume-up"></i>
                <div class="home-tips-container">
                    <span style="color: rgb(0, 150, 136); cursor: pointer; display: none;"><p><span>网站处于试运行过程，如遇到bug，可以及时与我联系哦，首页左侧可以联系我，或者给我留言。</span></p>
                    </span><span style="color: rgb(0, 150, 136); cursor: pointer; display: block;"><p><span>筠博客&nbsp; —— &nbsp;一个爱好python程序员的博客，网站采用Layui为前端框架，记录技术交流，工作心得体会！</span></p>
                    </span><span style="color: rgb(0, 150, 136); cursor: pointer; display: none;">感谢您发现本站，由于某些原因导致数据库丢失，但本站内容会持续更新的。</span>
                </div>
            </div>

            <div class="blog-main-left animated slideInLeft">
                <div class="flow-default" id="parentArticleList">
                    {% for data in T_data %}
                    <div class="article shadow animated zoomIn">
                        <div class="article-left ">
                            <img src="/{{data.cover}}" alt="">
                        </div>
                        <div class="article-right">
                            <div class="article-title">
                                <span class="article_is_top" style="background:#ffae1e !important">{{data.hot}}</span>&nbsp;<span class="article_is_yc">原创</span>&nbsp;
                                <a href="{{url_for('article_editor')}}?id={{data.id}}" style="font-size: 17px;">{{data.title}}</a>
                            </div>
                            <div class="article-abstract">
                                {{data.text_body[:60]}}...
                            </div>
                        </div>
                        <div class="clear"></div>
                        <div class="article-footer">
                            <span><i class="fa fa-clock-o"></i>&nbsp;&nbsp;{{data.create_time}}</span>
                            <span class="article-author"><i class="fa fa-user"></i>&nbsp;&nbsp;' <a href="{{url_for('user', username=data.author.username)}}">{{data.author.username}}</a></span>
                            <!-- <span><i class="fa fa-tag"></i>&nbsp;&nbsp;<a href="javascript:classifyList(10);"> Tomcat</a></span> -->
                            <span class="article-viewinfo"><i class="fa fa-eye"></i>&nbsp;{{data.views}}</span>
                            <!-- <span class="article-viewinfo"><i class="fa fa-commenting"></i>&nbsp;3</span> -->
                        </div>
                    </div>
                    {% endfor %}
                    <div id="demo-laypage-layout-1"></div>
                </div>
            </div>

            <div class="blog-main-right">

                <div class="blogerinfo shadow animated fadeInRight">
                    <div class="blogerinfo-figure">
                        <img src="{{user_data.Storage_path}}" alt="{{user_data.username}}">
                    </div>
                    <a href="{{url_for('user', username=user_data.username)}}"><p style="color: #ffc178" class="blogerinfo-nickname">{{user_data.username}}</p></a>
                    <p class="blogerinfo-introduce" style="font-size: 13px;">{{user_data.about_me}}</p>
                    <p class="blogerinfo-location"><i class="fa fa-location-arrow"></i>&nbsp;<span>中国</span></p>
                    <hr>
                    <div class="blogerinfo-contact">
                        <a target="_blank" id="QQjl" title="QQ交流" href="#"><i class="fa fa-qq fa-2x"></i></a>
                        <a target="_blank" id="gwxx" title="给我写信" href="#"><i class="fa fa-envelope fa-2x"></i></a>
                        <a target="_blank" id="xlwb" title="新浪微博" href="#"><i class="fa fa-weibo fa-2x"></i></a>
                        <a target="_blank" id="htgl" title="后台管理" href="#"><i class="fa fa-database fa-2x"></i></a>
                    </div>
                </div>

                <div class="layui-tab layui-tab-brief shadow animated fadeInRight" lay-filter="docDemoTabBrief">
                    <ul class="layui-tab-title">
                        <li class="layui-this">点击排行</li>
                    </ul>
                    <div class="layui-tab-content" style="padding: 15px;">
                        <div class="layui-tab-item layui-show">
                            <ul class="blog-module-ul">
                                {% for item in popular_ten_data %}
                                <li>
                                    <span>
                                        {% autoescape false %}
                                            {{item.color}}
                                        {% endautoescape %}
                                    </span> &nbsp;&nbsp;
                                    <a href="{{url_for('article_editor')}}?id={{item.id}}">{{item.title}}</a>
                                </li>
                                {% endfor %}
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="clear"></div>
    </div>
</div>
<script src="{{url_for('static',filename='js/global.js')}}"></script>
<script src="{{url_for('static',filename='js/index.js')}}"></script>
<script>
    layui.use(function(){
      var laypage = layui.laypage;
      // 自定义排版
        laypage.render({
            elem: 'demo-laypage-layout-1',
            count: '{{ paginate.total }}',
            curr: location.hash.replace('#!page=', ''), // 初始获取 hash 值为 curr 的当前页
            hash: 'curr', // 自定义 hash 名称
            layout: ['prev', 'page', 'next'],
            skipText: ['Go to', '', 'Confirm'],
            jump: function(obj, first){
                // console.log(obj); // 得到当前页，以便向服务端请求对应页的数据。
                // 首次不执行
                if(!first){
                    window.location.href = '{{url_for("index")}}?page='+obj.curr+'&#!page='+obj.curr           
                }
            }

        });
    })
</script>
{% endblock %}